<template>
	<view class="content">
		<view class="add-box">
			<u-form :model="form" ref="uForm">
				<u-form-item label-width="180" label="项目名称" prop="name">
					<u-input v-model="form.name" placeholder="请输入项目名称" />
				</u-form-item>
				<u-form-item label-width="180" label="项目负责人" prop="contact">
					<u-input v-model="name" @click="selectShow = true" placeholder="请输选择项目负责人" type="select" />
				</u-form-item>
				<u-form-item :border-bottom="false" label="上传图片" prop="photo" label-width="150">
					<!-- <u-upload width="160" height="160"></u-upload> -->
					<u-upload width="160" height="160" :form-data="queryOss" :action="action" :auto-upload="false" ref="uUpload"
					 max-count="1" :show-progress="false" :multiple="false" @on-choose-complete="changeImg()"></u-upload>
				</u-form-item>
			</u-form>
		</view>
		<view class="button-box">
			<u-button type="primary" @tap="addProject" :disabled="isclick">添加</u-button>
		</view>
		<view class="nav" v-show="isclick">
			<navigator url="/pages/root/user/addUser/index" hover-class="navigator-hover">
				<view>没有负责人？前往添加 &nbsp; <u-icon name="arrow-right"></u-icon></view>
			</navigator>
		</view>
		<u-select mode="single-column" :list="selectList" v-model="selectShow" @confirm="selectConfirm"></u-select>
	</view>
</template>

<script>
	import {
		createPeoject
	} from '@/api/project.js'
	import {
		getUserInfo
	} from '@/api/user.js'
	import {
		ossimg
	} from '@/api/oss.js'
	export default {
		data() {
			return {
				form: {
					name: '',
					contactId: null,
					logo: '',
				},
				selectShow: false,
				isclick: false,
				name: '',
				action: '',
				dir: '',
				queryOss: {},
				rules: {
					name: [{
						required: true,
						message: '请输入项目名称',
						// 可以单个或者同时写两个触发验证方式 
						trigger: ['change', 'blur'],
					}],
				},
				queryInfo: {
					roleId: 2
				},
				selectList: [],
			};
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		created() {
			this.getOss()
			this.getUserSelect()
		},
		onShow() {
			var pages = getCurrentPages();
			this.prevPage = pages[pages.length - 1];
			if (this.prevPage.brand === true) {
				this.getUserSelect()
			}
		},
		methods: {
			// 选择商品类型回调
			selectConfirm(e) {
				e.map((val, index) => {
					this.form.contactId = val.value
					this.name = val.label
					// console.log(val)
				});
			},
			changeImg(event) {
				let files = this.$refs.uUpload.lists;
				this.queryOss.Filename = files[0].file.name
				const imgFormat = files[0].url.split('/').pop().split('.')[1];
				const imgName = files[0].url.split('/').pop().split('.')[0];
				const imgMd5Name = this.$md5(imgName);
				this.queryOss.key = `${this.dir}${imgMd5Name}.${imgFormat}`
				this.form.logo = this.action + '/' + this.queryOss.key
			},
			getOss(){
				ossimg({
					dir: 'project'
				}).then(res => {
					console.log(res);
					this.queryOss = res.result
					this.queryOss.OSSAccessKeyId = res.result.accessid
					const {
						host,
						OSSAccessKeyId,
						policy,
						signature,
						dir
					} = res.result
					this.queryOss = {
						'OSSAccessKeyId': OSSAccessKeyId,
						'policy': policy,
						'signature': signature,
						'success_action_status': '200',
					}
					this.action = res.result.host
					this.dir = dir
					console.log(this.action);
				})
			},
			addProject() {
				if (this.form.contactId === null) {
					uni.showToast({
						title: "请选择项目负责人",
						icon: "none"
					})
					return
				}
				this.$refs.uForm.validate(valid => {
					if (valid) {
						this.$refs.uUpload.upload();
						createPeoject(this.form).then(res => {
							console.log(res)
							if (res.code === 1) {
								uni.showToast({
									title: '创建成功',
									icon: "none"
								})
								setTimeout(() => {
									var item = true; //item为要传的值
									var pages = getCurrentPages();
									var prevPage = pages[pages.length - 2];
									prevPage.brand = item;
									uni.navigateBack()
								}, 500)
							} else {
								uni.showToast({
									title: res.msg,
									icon: 'none'
								})
							}
						}).catch(() => {
							uni.showToast({
								title: "出错了",
								icon: 'none'
							})
						})
					}
				});
				console.log(this.form)
			},
			getUserSelect() {
				if (this.prevPage.brand === true) {
					this.prevPage.brand = false
				}
				getUserInfo(this.queryInfo).then(res => {
					// console.log(res.result.data)
					let dataList = res.result

					console.log(dataList)
					if (dataList.length === 0) {
						// console.log("没有东西")
						// uni.showModal({
						// 	title: "提示",
						// 	content: "未检测到项目负责人，请添加",
						// 	// showCancel: false,
						// 	success: res =>{
						// 		if(res.confirm){
						// 			uni.navigateTo({
						// 				url:'/pages/root/user/addUser/index'
						// 			})
						// 		}
						// 	}
						// })
						this.isclick = true
						return
					}
					dataList.forEach((result, index) => {
						// console.log(index)
						let item = {}
						item.label = result.name
						item.value = result.id
						this.selectList[index] = item
					})
					// console.log(this.selectList)
				})
			}
		}
	};
</script>

<style lang="scss" scoped>
	.content {
		padding: 40rpx;

		.add-box {
			background-color: #ffffff;
			border-radius: 10rpx;
			padding: 20rpx;
		}

		.button-box {
			margin-top: 80rpx;
		}
	}
	.nav{
		text-align: center;
		margin-top: 100rpx;
		color: blue;
	}
</style>
